<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div>demo - div</div>
    <div>demo - div</div>
    <div>demo - div</div>
    <div>demo - div</div>
    <div>demo - div</div>
    <script>
        //先自调用函数
        (function(window, undefined) {
            // 先把jQuery当做一个构造函数
            //其实是工厂函数
            var jQuery = function(selector) {
                    return new jQuery.fn.init(selector);
                }
                //原型替换
            jQuery.fn = jQuery.prototype = {
                    constructor: jQuery,
                    //新创建的原型对象没有constructor属性 需要手动添加
                    init: function(selector) {
                        var elements = document.querySelectorAll(selector);
                        [].push.apply(this, elements)
                    },
                    css: function() {
                        console.log('css is ok');

                    }
                }
                //暴露
            window.jQuery = window.$ = jQuery
        })(window)
        var $divs = $('div') // init 的实例对象
        console.log($divs);
    </script>
</body>

</html>